import 'package:flutter/material.dart';
import '../../helper/utils/util.dart';

class StepBar extends StatelessWidget {
  const StepBar({
    Key? key,
    required this.list,
    this.initialIndex = 2,
    this.itemW,
  }) : super(key: key);
  final List<String> list;
  final int initialIndex;
  final double? itemW;
  @override
  Widget build(BuildContext context) {
    var w = itemW ?? 80.r;
    return Column(
      children: [
        Row(
          children: List.generate(list.length * 2 - 1, (index) {
            var idx = (index + 1) ~/ 2 + 1;
            var color =
                (initialIndex >= idx) ? Colors.blue : const Color(0xff999999);
            if (index.isOdd) {
              return Expanded(
                  child: Container(
                height: 1,
                color: color,
              ));
            }
            return Container(
              width: 24.r,
              height: 24.r,
              margin: EdgeInsets.only(
                  left: index == 0 ? ((w - 24.r) / 2) : 0,
                  right: idx == list.length ? (w - 24.r) / 2 : 0),
              alignment: Alignment.center,
              decoration: BoxDecoration(
                border: Border.all(color: color),
                borderRadius: BorderRadius.circular(12.r),
              ),
              child: Text(
                idx.toString(),
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: color,
                  fontSize: 15.sp,
                ),
              ),
            );
          }),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: list
              .asMap()
              .map((key, e) => MapEntry(
                    key,
                    Container(
                      width: w,
                      alignment: Alignment.center,
                      child: Text(
                        e,
                        style: TextStyle(
                          color: initialIndex == (key + 1)
                              ? Colors.blue
                              : const Color(0xff999999),
                        ),
                      ),
                    ),
                  ))
              .values
              .toList(),
        ),
      ],
    );
  }
}
